<script setup lang="ts">

const router = useRouter()

const first = useFirst()

const config = useRuntimeConfig()

const list = [{
  src: config.app.baseURL + 'image/chat.svg',
  name: '破壳AI',
  link: 'https://chat.pushplus.plus'
}, {
  src: config.app.baseURL + 'image/tupian.svg',
  name: '文生图工具',
  link: '/tti'
}, {
  src: config.app.baseURL + 'image/translate.svg',
  name: '翻译工具',
  link: '/translate'
}]

const toLink = (link: string) => {
  if (/^(http|https)/.test(link)) {
    window.open(link)
  } else {
    router.push(link)
  }
}

</script>
<template>
  <div style="min-height: 100dvh;">
    <div class="border-b sticky z-20 header-bg" :style="{top: `${first.headerHeight}px`}">
      <!-- 粘性组件 -->
      <HomeSticky class="max-w-[1680px] mx-auto" />
    </div>
    <!-- 列表组件 -->
    <Space class="grid xl:grid-cols-4 lg:grid-cols-3 md:grid-cols-2 grid-cols-1 gap-2 pt-4">
      <HomeCard v-for="item in list" :key="item.src" :content="item" @to="toLink" />
    </Space>
  </div>
</template>
